
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html"; charset="utf-8" />
<title></title>
<link href="../../css/main.css" rel="stylesheet" type="text/css">
    <link href="../../bstable/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="../../bstable/css/bootstrap-table.css" rel="stylesheet" type="text/css">

</head>
<body>
<div class="tabe_div">
    <p class="p_line text_ient"><a class="find_a">名称：</a><input type="text" class="form_input text_ient" placeholder="输入名称"/><a  class="find_a">选择状态：</a> <select class="form_select"><option>选择状态</option></select><a  class="find_a">时间：</a><input class="form_date text_ient" id="demo" placeholder="输入年月"/>
        <input type="button" value="查询" class="but_find"/><p>
    <p class="p_table">
    <a href="#" class="a_add" id="add_box" onclick="openlayer('')">添加</a><a href="#"  class="a_add" onclick="openlayer('')">编辑</a><a href="#" class="a_del">删除</a><a href="#" class="a_add">全部导出</a><a href="#" class="a_add">上传模板</a>
</p>


    <table data-url="json/data_alae_list.json" id="table" class="table_style" style="margin: 0 auto" >
    </table>





</div>
<!--<div class="div_foot_left"><a>每页显示：<input type="text" class="input_foot"/>条 </a><a class="a_foot_line">共10条数据</a><a class="a_foot_line">当前1/10页</a><a class="a_foot_line">刷新列表</a><div class="clear"></div></div>-->

<!--&lt;!&ndash;<div class="div_foot_right">&ndash;&gt;-->
    <!--&lt;!&ndash;<a>首页</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a class="a_foot_line">上一页</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">1</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">2</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">3</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">4</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">5</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">下一页</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">末页</a>&ndash;&gt;-->
    <!--&lt;!&ndash;<a  class="a_foot_line">跳转至：<input type="text" class="input_foot"/>页 </a>&ndash;&gt;-->
<!--&lt;!&ndash;</div>&ndash;&gt;-->
<div></div>
<script src="../../js/jquery.js"></script>
<script src="../../js/date/js/laydate.js"></script>
<script src="../../bstable/js/bootstrap.min.js"></script>
<script src="../../bstable/js/bootstrap-table.js"></script>
<script src="../../bstable/js/bootstrap-table-zh-CN.min.js"></script>
<script>
    !function(){
        laydate.skin('danlan');//切换皮肤，请查看skins下面皮肤库
        laydate({elem: '#demo'});
        laydate({elem: '#demo1'});//绑定元素
    }();
</script>

<script type="text/javascript">
    $(function () {
        $('#table').bootstrapTable({
            method: "get",
            striped: true,
            singleSelect: false,
            url: "../../json/data_alae_list.json",
            dataType: "json",
            pagination: true, //分页
            pageSize: 10,
            pageNumber: 1,
            search: false, //显示搜索框
            contentType: "application/x-www-form-urlencoded",
            queryParams: null,
            columns: [
                {
                    title: "编号",
                    field: 'id',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '报警类型',
                    field: 'type',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '处置情况',
                    field: 'statice',
                    align: 'center'
                },
                {
                    title: '报警位置',
                    field: 'location',
                    align: 'center'
                },
                {
                    title: '报警时间',
                    field: 'time',
                    align: 'center'
                },
                {
                    title: '报警人',
                    field: 'peop',
                    align: 'center'
                },
                {
                    title: '概述',
                    field: 'content',
                    align: 'center'
                },
                {
                    title: '操作',
                    field: 'oper',
                    align: 'center',
                    formatter: function (value, row) {
                        var e = '<button button="#" mce_href="#" onclick="handleEvent(\'' + row.id + '\')">处置</button> ';
                        var d = '<button button="#" mce_href="#" onclick="edit(\'' + row.id + '\')">关闭</button> ';
                        var c = '<button button="#" mce_href="#" onclick="edit(\'' + row.id + '\')">预案</button> ';
                        return e + d + c;
                    }
                }
            ]
        });
    })

    function handleEvent(id){
        this.location.href="alam_handle.html";

    }



</script>
<script src="../../layer_v2.1/layer/layer.js"></script>
<script type="text/javascript">

    function openlayer(id){
        layer.open({
            type: 2,
            title: '添加信息',
            shadeClose: true,
            shade: 0.5,
            skin: 'layui-layer-rim',
//            maxmin: true,
            closeBtn:1,
            area: ['80%', '75%'],
            shadeClose: true,
            closeBtn: 1,
            content: 'layer_box1.html'
            //iframe的url
        });
    }
</script>
</body>
</html>
